<template>
  <div class="app-container">
    <div class="filter-container">
      <el-form :inline="true" ref="listQuery" :model="listQuery" class="demo-form-inline">
        <el-form-item prop="oauth2AuthenticationCsrf">
          <el-input v-model="listQuery.oauth2AuthenticationCsrf" placeholder="oauth2_authentication_csrf" @keyup.enter="handleFilter" />
        </el-form-item>
        <el-form-item prop="tifAtlasAuth">
          <el-input v-model="listQuery.tifAtlasAuth" placeholder="tif_atlas_auth" @keyup.enter="handleFilter" />
        </el-form-item>
        <el-form-item prop="ltpatoken">
          <el-input v-model="listQuery.ltpatoken" placeholder="ltpatoken" @keyup.enter="handleFilter" />
        </el-form-item>
        <el-form-item prop="sessionid2">
          <el-input v-model="listQuery.sessionid2" placeholder="sessionid2" @keyup.enter="handleFilter" />
        </el-form-item>
        <el-form-item prop="dgdWwlid">
          <el-input v-model="listQuery.dgdWwlid" placeholder="dgd_wwlid" @keyup.enter="handleFilter" />
        </el-form-item>
        <el-form-item prop="zkDgdWwlid">
          <el-input v-model="listQuery.zkDgdWwlid" placeholder="zk_dgd_wwlid" @keyup.enter="handleFilter" />
        </el-form-item>
        <el-form-item prop="storecode">
          <el-input v-model="listQuery.storecode" placeholder="storecode" @keyup.enter="handleFilter" />
        </el-form-item>
        <el-form-item prop="tokenid">
          <el-input v-model="listQuery.tokenid" placeholder="tokenid" @keyup.enter="handleFilter" />
        </el-form-item>
        <el-form-item prop="userid">
          <el-input v-model="listQuery.userid" placeholder="userid" @keyup.enter="handleFilter" />
        </el-form-item>
        <el-form-item prop="curRoleId">
          <el-input v-model="listQuery.curRoleId" placeholder="cur_role_id" @keyup.enter="handleFilter" />
        </el-form-item>
        <el-form-item prop="curYear">
          <el-input v-model="listQuery.curYear" placeholder="cur_year" @keyup.enter="handleFilter" />
        </el-form-item>
        <el-form-item prop="menuCode">
          <el-input v-model="listQuery.menuCode" placeholder="menu_code" @keyup.enter="handleFilter" />
        </el-form-item>
        <el-form-item>
          <el-button v-waves type="success" icon="Search" @click="handleFilter">
            查询
          </el-button>
          <el-button icon="Refresh" @click="handleResetQuery">
            重置
          </el-button>
          <el-button v-show="checkAuthByCode('')" type="primary" icon="Edit" @click="handleAdd">
            新增
          </el-button>
          <el-button v-show="checkAuthByCode('')" type="primary" icon="Download" @click="handleExport">
            导出
          </el-button>
        </el-form-item>
      </el-form>
    </div>
    <el-divider class="el-divider--horizontal-margin" />
    <el-table
      :key="tableKey"
      v-loading="listLoading"
      :data="list"
      :row-style="{height: '0'}"
      :cell-style="{padding: '0'}"
      border
      fit
      highlight-current-row
      tooltip-effect="dark"
      style="width: 100%;"
      @sort-change="handleSortChange"
      @selection-change="handleSelectionChange"
    >
      <el-table-column type="selection" width="39px" />
      <el-table-column align="center" type="index" label="序号" width="60px" />
      <el-table-column v-if="isDebug" align="center" label="ID" prop="id" width="60px" sortable show-overflow-tooltip />
      <el-table-column align="center" label="oauth2_authentication_csrf" prop="oauth2AuthenticationCsrf" min-width="655px" sortable show-overflow-tooltip>
        <template v-slot="{row}">{{ row.oauth2AuthenticationCsrf }}</template>
      </el-table-column>
      <el-table-column align="center" label="tif_atlas_auth" prop="tifAtlasAuth" min-width="355px" sortable show-overflow-tooltip>
        <template v-slot="{row}">{{ row.tifAtlasAuth }}</template>
      </el-table-column>
      <el-table-column align="center" label="ltpatoken" prop="ltpatoken" min-width="230px" sortable show-overflow-tooltip>
        <template v-slot="{row}">{{ row.ltpatoken }}</template>
      </el-table-column>
      <el-table-column align="center" label="sessionid2" prop="sessionid2" min-width="255px" sortable show-overflow-tooltip>
        <template v-slot="{row}">{{ row.sessionid2 }}</template>
      </el-table-column>
      <el-table-column align="center" label="dgd_wwlid" prop="dgdWwlid" min-width="230px" sortable show-overflow-tooltip>
        <template v-slot="{row}">{{ row.dgdWwlid }}</template>
      </el-table-column>
      <el-table-column align="center" label="zk_dgd_wwlid" prop="zkDgdWwlid" min-width="305px" sortable show-overflow-tooltip>
        <template v-slot="{row}">{{ row.zkDgdWwlid }}</template>
      </el-table-column>
      <el-table-column align="center" label="storecode" prop="storecode" min-width="230px" sortable show-overflow-tooltip>
        <template v-slot="{row}">{{ row.storecode }}</template>
      </el-table-column>
      <el-table-column align="center" label="tokenid" prop="tokenid" min-width="180px" sortable show-overflow-tooltip>
        <template v-slot="{row}">{{ row.tokenid }}</template>
      </el-table-column>
      <el-table-column align="center" label="userid" prop="userid" min-width="155px" sortable show-overflow-tooltip>
        <template v-slot="{row}">{{ row.userid }}</template>
      </el-table-column>
      <el-table-column align="center" label="cur_role_id" prop="curRoleId" min-width="280px" sortable show-overflow-tooltip>
        <template v-slot="{row}">{{ row.curRoleId }}</template>
      </el-table-column>
      <el-table-column align="center" label="cur_year" prop="curYear" min-width="205px" sortable show-overflow-tooltip>
        <template v-slot="{row}">{{ row.curYear }}</template>
      </el-table-column>
      <el-table-column align="center" label="menu_code" prop="menuCode" min-width="230px" sortable show-overflow-tooltip>
        <template v-slot="{row}">{{ row.menuCode }}</template>
      </el-table-column>
      <el-table-column align="center" label="cookie" prop="cookie" min-width="155px" sortable show-overflow-tooltip>
        <template v-slot="{row}">{{ row.cookie }}</template>
      </el-table-column>
      <el-table-column align="center" label="接口1header" prop="resp1Header" min-width="230px" sortable show-overflow-tooltip>
        <template v-slot="{row}">{{ row.resp1Header }}</template>
      </el-table-column>
      <el-table-column align="center" label="接口1body" prop="resp1Body" min-width="180px" sortable show-overflow-tooltip>
        <template v-slot="{row}">{{ row.resp1Body }}</template>
      </el-table-column>
      <el-table-column align="center" label="接口2header" prop="resp2Header" min-width="230px" sortable show-overflow-tooltip>
        <template v-slot="{row}">{{ row.resp2Header }}</template>
      </el-table-column>
      <el-table-column align="center" label="接口2body" prop="resp2Body" min-width="180px" sortable show-overflow-tooltip>
        <template v-slot="{row}">{{ row.resp2Body }}</template>
      </el-table-column>
      <el-table-column align="center" label="接口3header" prop="resp3Header" min-width="230px" sortable show-overflow-tooltip>
        <template v-slot="{row}">{{ row.resp3Header }}</template>
      </el-table-column>
      <el-table-column align="center" label="接口3body" prop="resp3Body" min-width="180px" sortable show-overflow-tooltip>
        <template v-slot="{row}">{{ row.resp3Body }}</template>
      </el-table-column>
      <el-table-column align="center" label="接口4header" prop="resp4Header" min-width="230px" sortable show-overflow-tooltip>
        <template v-slot="{row}">{{ row.resp4Header }}</template>
      </el-table-column>
      <el-table-column align="center" label="接口4body" prop="resp4Body" min-width="180px" sortable show-overflow-tooltip>
        <template v-slot="{row}">{{ row.resp4Body }}</template>
      </el-table-column>
      <el-table-column align="center" label="接口5header" prop="resp5Header" min-width="230px" sortable show-overflow-tooltip>
        <template v-slot="{row}">{{ row.resp5Header }}</template>
      </el-table-column>
      <el-table-column align="center" label="接口5body" prop="resp5Body" min-width="180px" sortable show-overflow-tooltip>
        <template v-slot="{row}">{{ row.resp5Body }}</template>
      </el-table-column>
      <el-table-column align="center" label="创建时间" width="180px" prop="createTime" sortable show-overflow-tooltip>
        <template v-slot="{row}"><DateTag :timestamp="row.createTime" /></template>
      </el-table-column>
      <el-table-column align="center" label="最后修改时间" width="180px" prop="updateTime" sortable show-overflow-tooltip>
        <template v-slot="{row}"><DateTag :timestamp="row.updateTime" /></template>
      </el-table-column>
      <el-table-column align="center" label="操作" width="160px" fixed="right">
        <template v-slot="{row}">
          <el-button type="primary" link @click="handleView(row)">查看</el-button>
          <el-button v-show="checkAuthByCode('')" type="primary" link @click="handleEdit(row)">编辑</el-button>
          <el-popconfirm confirm-button-text="确定"
                         cancel-button-text="取消"
                         :icon="WarningFilled"
                         icon-color="#626AEF"
                         title="您确定删除么？"
                         @confirm="handleDelete(row)"
                         v-if="checkAuthByCode('')">
            <template #reference>
              <el-button type="danger" link>删除</el-button>
            </template>
          </el-popconfirm>
        </template>
      </el-table-column>
    </el-table>
    <pagination v-model:total="total" v-model:page="listQuery.pageNum" v-model:limit="listQuery.pageSize" @pagination="getList" />
    <el-dialog v-model="dialogVisible" :title="dialogTypeTitle" width="70%" top="2vh">
      <el-form class="my-form" ref="obj" :model="obj" :rules="rules" label-position="right" :disabled="dialogType === 'view'" label-width="auto">
        <el-form-item v-show="isDebug" label="ID">
          <text>{{ obj.id }}</text>
        </el-form-item>
        <el-form-item label="oauth2_authentication_csrf" prop="oauth2AuthenticationCsrf">
          <el-input v-model="obj.oauth2AuthenticationCsrf" placeholder="请输入oauth2_authentication_csrf，最多输入100个字符" />
        </el-form-item>
        <el-form-item label="tif_atlas_auth" prop="tifAtlasAuth">
          <el-input v-model="obj.tifAtlasAuth" placeholder="请输入tif_atlas_auth，最多输入200个字符" />
        </el-form-item>
        <el-form-item label="ltpatoken" prop="ltpatoken">
          <el-input v-model="obj.ltpatoken" placeholder="请输入ltpatoken，最多输入100个字符" />
        </el-form-item>
        <el-form-item label="sessionid2" prop="sessionid2">
          <el-input v-model="obj.sessionid2" placeholder="请输入sessionid2，最多输入200个字符" />
        </el-form-item>
        <el-form-item label="dgd_wwlid" prop="dgdWwlid">
          <el-input v-model="obj.dgdWwlid" placeholder="请输入dgd_wwlid，最多输入200个字符" />
        </el-form-item>
        <el-form-item label="zk_dgd_wwlid" prop="zkDgdWwlid">
          <el-input v-model="obj.zkDgdWwlid" placeholder="请输入zk_dgd_wwlid，最多输入200个字符" />
        </el-form-item>
        <el-form-item label="storecode" prop="storecode">
          <el-input v-model="obj.storecode" placeholder="请输入storecode，最多输入100个字符" />
        </el-form-item>
        <el-form-item label="tokenid" prop="tokenid">
          <el-input v-model="obj.tokenid" placeholder="请输入tokenid，最多输入100个字符" />
        </el-form-item>
        <el-form-item label="userid" prop="userid">
          <el-input v-model="obj.userid" placeholder="请输入userid，最多输入200个字符" />
        </el-form-item>
        <el-form-item label="cur_role_id" prop="curRoleId">
          <el-input v-model="obj.curRoleId" placeholder="请输入cur_role_id，最多输入200个字符" />
        </el-form-item>
        <el-form-item label="cur_year" prop="curYear">
          <el-input v-model="obj.curYear" placeholder="请输入cur_year，最多输入200个字符" />
        </el-form-item>
        <el-form-item label="menu_code" prop="menuCode">
          <el-input v-model="obj.menuCode" placeholder="请输入menu_code，最多输入200个字符" />
        </el-form-item>
        <el-form-item label="cookie" prop="cookie">
          <el-input v-model="obj.cookie" :autosize="{ minRows: 2, maxRows: 5}" type="textarea" />
        </el-form-item>
        <el-form-item label="接口1header" prop="resp1Header">
          <el-input v-model="obj.resp1Header" :autosize="{ minRows: 2, maxRows: 5}" type="textarea" />
        </el-form-item>
        <el-form-item label="接口1body" prop="resp1Body">
          <el-input v-model="obj.resp1Body" :autosize="{ minRows: 2, maxRows: 5}" type="textarea" />
        </el-form-item>
        <el-form-item label="接口2header" prop="resp2Header">
          <el-input v-model="obj.resp2Header" :autosize="{ minRows: 2, maxRows: 5}" type="textarea" />
        </el-form-item>
        <el-form-item label="接口2body" prop="resp2Body">
          <el-input v-model="obj.resp2Body" :autosize="{ minRows: 2, maxRows: 5}" type="textarea" />
        </el-form-item>
        <el-form-item label="接口3header" prop="resp3Header">
          <el-input v-model="obj.resp3Header" :autosize="{ minRows: 2, maxRows: 5}" type="textarea" />
        </el-form-item>
        <el-form-item label="接口3body" prop="resp3Body">
          <el-input v-model="obj.resp3Body" :autosize="{ minRows: 2, maxRows: 5}" type="textarea" />
        </el-form-item>
        <el-form-item label="接口4header" prop="resp4Header">
          <el-input v-model="obj.resp4Header" :autosize="{ minRows: 2, maxRows: 5}" type="textarea" />
        </el-form-item>
        <el-form-item label="接口4body" prop="resp4Body">
          <el-input v-model="obj.resp4Body" :autosize="{ minRows: 2, maxRows: 5}" type="textarea" />
        </el-form-item>
        <el-form-item label="接口5header" prop="resp5Header">
          <el-input v-model="obj.resp5Header" :autosize="{ minRows: 2, maxRows: 5}" type="textarea" />
        </el-form-item>
        <el-form-item label="接口5body" prop="resp5Body">
          <el-input v-model="obj.resp5Body" :autosize="{ minRows: 2, maxRows: 5}" type="textarea" />
        </el-form-item>
        <el-form-item label="创建时间">
          <text>{{ obj.createTime ? obj.createTime : '自动生成' }}</text>
        </el-form-item>
        <el-form-item label="最后修改时间">
          <text>{{ obj.updateTime ? obj.updateTime : '自动生成' }}</text>
        </el-form-item>
        <el-form-item v-show="isDebug" label="数据版本">
          <text>{{ obj.version }}</text>
        </el-form-item>
      </el-form>
      <div style="text-align:right;">
        <el-button type="info" icon="Close" @click="dialogVisible=false">关闭</el-button>
        <el-button type="primary" icon="Check" v-show="dialogType !== 'view'" @click="doConfirm('obj')">确定</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import {doGet, doPost, doPut, doDelete, doGetDownload} from '@/config/http'
import baseConfig from '@/mixins/baseConfig'
import {alertErrorMsg, customValidator, notifySuccess} from "@/config/common";

const emptyObj = {
  oauth2AuthenticationCsrf: null, // oauth2_authentication_csrf
  tifAtlasAuth: null, // tif_atlas_auth
  ltpatoken: null, // ltpatoken
  sessionid2: null, // sessionid2
  dgdWwlid: null, // dgd_wwlid
  zkDgdWwlid: null, // zk_dgd_wwlid
  storecode: null, // storecode
  tokenid: null, // tokenid
  userid: null, // userid
  curRoleId: null, // cur_role_id
  curYear: null, // cur_year
  menuCode: null, // menu_code
  cookie: null, // cookie
  resp1Header: null, // 接口1header
  resp1Body: null, // 接口1body
  resp2Header: null, // 接口2header
  resp2Body: null, // 接口2body
  resp3Header: null, // 接口3header
  resp3Body: null, // 接口3body
  resp4Header: null, // 接口4header
  resp4Body: null, // 接口4body
  resp5Header: null, // 接口5header
  resp5Body: null, // 接口5body
  id: null,
  createBy: null,
  createTime: null,
  updateBy: null,
  updateTime: null,
  deleted: null,
  version: null
}

export default {
  name: 'ysyLogin_nocache',
  mixins: [baseConfig],
  data() {
    return {
      svc: 'icims-api',
      obj: Object.assign({}, emptyObj),
      routes: [],
      dialogVisible: false,
      dialogType: 'add',
      dialogTypeTitle: '新增',
      checkStrictly: false,
      defaultProps: {
        children: 'children',
        label: 'title'
      },
      tableKey: 0,
      list: null,
      total: 0,
      listLoading: false,
      listQuery: {
        pageNum: 1,
        pageSize: 10,
        sortField: 'id',
        sortType: 'desc',
        oauth2AuthenticationCsrf: null,
        tifAtlasAuth: null,
        ltpatoken: null,
        sessionid2: null,
        dgdWwlid: null,
        zkDgdWwlid: null,
        storecode: null,
        tokenid: null,
        userid: null,
        curRoleId: null,
        curYear: null,
        menuCode: null,
        createTimeStart: null,
        createTimeEnd: null,
        updateTimeStart: null,
        updateTimeEnd: null,
      },
      selectionList: [],
      dialogFormVisible: false,
      dialogStatus: '',
      rules: {
        oauth2AuthenticationCsrf: [{ required: false, validator: customValidator, min: 0, max: 100, label: 'oauth2_authentication_csrf', trigger: ['blur', 'change'] }],
        tifAtlasAuth: [{ required: false, validator: customValidator, min: 0, max: 200, label: 'tif_atlas_auth', trigger: ['blur', 'change'] }],
        ltpatoken: [{ required: false, validator: customValidator, min: 0, max: 100, label: 'ltpatoken', trigger: ['blur', 'change'] }],
        sessionid2: [{ required: false, validator: customValidator, min: 0, max: 200, label: 'sessionid2', trigger: ['blur', 'change'] }],
        dgdWwlid: [{ required: false, validator: customValidator, min: 0, max: 200, label: 'dgd_wwlid', trigger: ['blur', 'change'] }],
        zkDgdWwlid: [{ required: false, validator: customValidator, min: 0, max: 200, label: 'zk_dgd_wwlid', trigger: ['blur', 'change'] }],
        storecode: [{ required: false, validator: customValidator, min: 0, max: 100, label: 'storecode', trigger: ['blur', 'change'] }],
        tokenid: [{ required: false, validator: customValidator, min: 0, max: 100, label: 'tokenid', trigger: ['blur', 'change'] }],
        userid: [{ required: false, validator: customValidator, min: 0, max: 200, label: 'userid', trigger: ['blur', 'change'] }],
        curRoleId: [{ required: false, validator: customValidator, min: 0, max: 200, label: 'cur_role_id', trigger: ['blur', 'change'] }],
        curYear: [{ required: false, validator: customValidator, min: 0, max: 200, label: 'cur_year', trigger: ['blur', 'change'] }],
        menuCode: [{ required: false, validator: customValidator, min: 0, max: 200, label: 'menu_code', trigger: ['blur', 'change'] }],
        cookie: [{ required: false, validator: customValidator, min: 0, max: 0, label: 'cookie', trigger: ['blur', 'change'] }],
        resp1Header: [{ required: false, validator: customValidator, min: 0, max: 0, label: '接口1header', trigger: ['blur', 'change'] }],
        resp1Body: [{ required: false, validator: customValidator, min: 0, max: 0, label: '接口1body', trigger: ['blur', 'change'] }],
        resp2Header: [{ required: false, validator: customValidator, min: 0, max: 0, label: '接口2header', trigger: ['blur', 'change'] }],
        resp2Body: [{ required: false, validator: customValidator, min: 0, max: 0, label: '接口2body', trigger: ['blur', 'change'] }],
        resp3Header: [{ required: false, validator: customValidator, min: 0, max: 0, label: '接口3header', trigger: ['blur', 'change'] }],
        resp3Body: [{ required: false, validator: customValidator, min: 0, max: 0, label: '接口3body', trigger: ['blur', 'change'] }],
        resp4Header: [{ required: false, validator: customValidator, min: 0, max: 0, label: '接口4header', trigger: ['blur', 'change'] }],
        resp4Body: [{ required: false, validator: customValidator, min: 0, max: 0, label: '接口4body', trigger: ['blur', 'change'] }],
        resp5Header: [{ required: false, validator: customValidator, min: 0, max: 0, label: '接口5header', trigger: ['blur', 'change'] }],
        resp5Body: [{ required: false, validator: customValidator, min: 0, max: 0, label: '接口5body', trigger: ['blur', 'change'] }],
      },
    }
  },
  computed: {
    routesData() {
      return this.routes
    }
  },
  created() {
    this.getList()
  },
  methods: {
    getList() {
      this.listLoading = true
      doGet(this.svc, '/budget-ysy-login/page', this.listQuery).then(res => {
        this.listLoading = false
        this.list = res['records']
        this.total = parseInt(res['total'])
      }).catch(e => {
        console.error(e)
        this.listLoading = false
      })
    },
    handleResetQuery() {
      this.resetForm("listQuery")
    },
    handleFilter() {
      this.listQuery.pageNum = 1
      this.getList()
    },
    handleModifyStatus(row, status) {
      this.$message({
        message: '操作Success',
        type: 'success'
      })
      row.status = status
    },
    handleSelectionChange(data) {
      this.selectionList = data
    },
    handleSortChange(data) {
      const { prop, order } = data
      this.listQuery.sortField = prop
      this.listQuery.sortType = order === 'ascending' ? 'asc' : 'desc'
      this.handleFilter()
    },
    handleEdit(row) {
      this.dialogType = 'edit'
      this.dialogTypeTitle = '编辑'
      this.dialogVisible = true
      this.checkStrictly = true
      this.obj = Object.assign({}, row)
    },
    handleView(row) {
      this.dialogType = 'view'
      this.dialogTypeTitle = '详情'
      this.dialogVisible = true
      this.checkStrictly = false
      this.obj = Object.assign({}, row)
    },
    handleAdd() {
      this.dialogType = 'add'
      this.dialogTypeTitle = '新增'
      this.dialogVisible = true
      this.checkStrictly = true
      this.obj = Object.assign({}, emptyObj)
    },
    handleExport() {
      doGetDownload(this.svc, '/budget-ysy-login/export', this.listQuery)
    },
    handleDelete(row) {
      doDelete(this.svc, '/budget-ysy-login/' + row.id, {}).then(() => {
        notifySuccess('操作成功')
        this.getList()
      })
    },
    async doConfirm(formName) {
      let v = await this.$refs[formName].validate().catch((err)=>{return err})
      if (v !== true) {
        alertErrorMsg('表单验证不通过，请检查数据。')
        return
      }
      if (this.dialogType === 'edit') {
        doPut(this.svc, '/budget-ysy-login/modify', this.obj).then(() => {
          notifySuccess('操作成功')
          this.getList()
          this.dialogVisible = false
        })
      } else if (this.dialogType === 'add') {
        doPost(this.svc, '/budget-ysy-login/add', this.obj).then(() => {
          notifySuccess('操作成功')
          this.getList()
          this.dialogVisible = false
        })
      }
    }
  }
}
</script>
